<template>
	<div class="pendingActivityDiscovery">
		<group class="pendingActivityDiscoveryGroup">
			<div style="  margin-top: 10px; margin-bottom: 10px">
				<span style="font-weight: bold; font-size: 18px; padding-left: 5px">{{title}}</span>
			</div>
		</group>

		<grid class="pendingActivityDiscoveryTitle" :show-vertical-dividers="false">
			<grid-item>
				<span class="grid-center">学生</span>
			</grid-item>
			<grid-item>
				<span class="grid-center">老师</span>
			</grid-item>
			<grid-item>
				<span class="grid-center">课程</span>
			</grid-item>
			<grid-item>
				<span class="grid-center">时间</span>
			</grid-item>
			<grid-item>
				<span class="grid-center">状态</span>
			</grid-item>
		</grid>

		<grid class="pendingActivityDiscoveryCell" v-for="(item, index) in items" :show-vertical-dividers="false">
			<grid-item class="grid-item" v-if="index < 5 || showMore" @click.native="jumpTo(item.id)">
				<span class="grid-center-name">{{item.student.substring(0,3)}}</span>
			</grid-item>
			<grid-item class="grid-item" v-if="index < 5 || showMore">
				<span class="grid-center">{{item.teacher.substring(0,3)}}</span>
			</grid-item>
			<grid-item class="grid-item" v-if="index < 5 || showMore">
				<span class="grid-center">{{item.lesson}}</span>
			</grid-item>
			<grid-item class="grid-item" v-if="index < 5 || showMore">
				<span class="grid-center">{{item.time}}</span>
			</grid-item>
			<grid-item class="grid-item" v-if="index < 5 || showMore">
				<span class="grid-center">{{item.status == 0 ? '待刷课':'待反馈'}}</span>
			</grid-item>
		</grid>
		<div style="text-align: center; background-color: lightyellow">
			<x-icon v-if="showMore == false" @click.native="showRecord" type="ios-arrow-down" size="30"></x-icon>
			<x-icon v-else @click.native="showRecord" type="ios-arrow-up" size="30"></x-icon>
		</div>

	</div>
</template>

<script>
	import NetWorking from '../../../../utils/networking'
	import {Group, Cell, XButton, Grid, GridItem} from 'vux'
	export default {
		name: "pending-activity-discovery",
		components: {
			Group,
			Cell,
			XButton,
			Grid,
			GridItem
		},
		data() {
			return {
				title: '待处理课程',
				items: [],
				showMore: false
			}
		},
		created: function () {
			let _this = this
			NetWorking.doGet(
				'ai/teachers/getPendingActivityModelList',
				null,
				null
			).then(
				response => {
					let rs = response.data
					if(rs.error_code == 0){
						_this.items = rs.pending_activity_list
					}else{
						alert(rs.error_message)
					}
				}
			)
		},
		methods: {
			showRecord: function () {
				this.showMore = !this.showMore
			},
			jumpTo: function (id) {
				//组件间传递参数
				this.$router.push({ name: "customerDetails", params: { id: id }})
			},

			viewMore: function () {
				this.$router.push({ name: "pendingActivityDiscoveryAll"})
			}
		}

	}
</script>

<style>
	.grid-center {
		display: block;
		text-align: center;
		color: #666;
	}

	.grid-center-name{
		display: block;
		text-align: center;
		color: #43abe3;
	}

	.pendingActivityDiscovery > .weui-grids > .weui-grid {
		padding: 10px 0px;
		text-decoration: none;
		font-size: 12px;
	}

	.pendingActivityDiscoveryTitle {
		background-color: lightgoldenrodyellow;
	}

	.pendingActivityDiscoveryCell {
		background-color: white;
	}

	.grid-item:after {
		border-bottom: 0px solid #D9D9D9 !important;
	}
</style>